﻿@namespace BootstrapBlazor.Components
@inherits BootstrapModuleComponentBase

<div tabindex="-1" class="bb-previewer collapse active" id="@Id" style="z-index: @ZIndex;">
    <div class="bb-viewer-mask"></div>
    <div class="bb-viewer-canvas">
        <img src="@GetFirstImageUrl()" class="bb-viewer-img" style="transform: scale(1) rotate(0deg); margin-left: 0px; margin-top: 0px;">
    </div>
    <span class="bb-viewer-btn bb-viewer-close">
        <span></span>
    </span>
    @if (ShowButtons)
    {
        <span class="bb-viewer-btn bb-viewer-prev">
            <i class="fa-solid fa-angle-left fa-2x"></i>
        </span>
        <span class="bb-viewer-btn bb-viewer-next">
            <i class="fa-solid fa-angle-right fa-2x"></i>
        </span>
    }
    <div class="bb-viewer-btn bb-viewer-actions">
        <div class="bb-viewer-actions-inner">
            <i class="fa-solid fa-magnifying-glass-minus"></i>
            <i class="fa-solid fa-magnifying-glass-plus"></i>
            <i class="bb-viewer-actions-divider"></i>
            <span class="bb-viewer-full-screen"></span>
            <i class="bb-viewer-actions-divider"></i>
            <i class="fa-solid fa-rotate-left"></i>
            <i class="fa-solid fa-rotate-right"></i>
        </div>
    </div>
</div>
